import React, { Component } from 'react';
import {
    StyleSheet,
    Text,
    View,
    Dimensions,
    PixelRatio,
    ScrollView
} from 'react-native';
import { Badge, Label } from 'iftide';

export default class Basic2 extends Component {
    render() {
        return (
            <View>
                <View style={styles.label}>
                    <Label text = '消息提醒样式二 - 角标' fontWeight={'bold'} textDecorationLine={'underline'}/>
                </View>
                <View style={styles.list}>
                    <Badge type='corner' text={'逛街'} badgePosition='leftTop' cornerColor={'green'}>
                        <View style={styles.childrenStyle}/>
                    </Badge>
                </View>
                <View style={styles.list}>
                    <Badge type='corner' text={'推荐'} badgePosition='rightTop'>
                        <Label text = 'Corner' type={'secTitle'} labelStyle={{paddingLeft: 13, paddingTop: 10}}/>
                    </Badge>
                </View>
            </View>
        );
    }
}
const styles = StyleSheet.create({
    label: {
        padding: 13,
        backgroundColor: '#F5F7F9',
        borderBottomWidth: 1,
        borderBottomColor: '#D8D8D8',
    },
    list: {
        height: 44,
        borderBottomWidth: 1,
        borderBottomColor: '#D8D8D8',
    },
    childrenStyle: {
        height: 30,
        width: 30,
        backgroundColor: '#D8D8D8',
        marginTop: 7,
        marginLeft: 18,
    }
});
